<template>
	<view class="containerbox login">
		<view class="containerbox mx-80">
			<!-- 头部 -->
			<login_header />
			
			<scroll-view scroll-y="true" class="containerbox">
				<!-- 表单 -->
				<login_form :form-type="codelogin" ref="formRef" />
				
				<!-- 操作按钮 -->
				<view class="mt-40">
					<fui-button text="登录" @click="onlogin" />
				</view>
				<!-- <fui-button
					type="link" 
					:text="codelogin ? '账户密码登录' : '验证码登录'" 
					color="#0B9AFF" 
					class="mt-20" 
					@click="codelogin = !codelogin" 
				/> -->
			</scroll-view>
		</view>
		
		<!-- 协议 -->
		<login_agreement ref="agreementRef" class="mb-40" />
	</view>
</template>

<script setup>
	
	import { ref, watch, nextTick } from 'vue'
	import { onLoad } from "@dcloudio/uni-app"
	
	import { imgPath } from '@/common/config.js'
	
	import login_header from './components/header'
	import login_form from './components/form'
	import login_agreement from './components/agreement'
	
	import { login, getuserInfo, symCodelogin } from '@/common/apis/account'
	
	const codelogin = ref(false)  // 默认验证码登录，否则手机号登录
	const formRef = ref(null)  // 表单组件实例
	const agreementRef = ref(null)  // 协议组件实例
	
	// onLoad(({ mobile }) => mobile && (codelogin.value = false)) 
	
	async function onlogin() {
		if (!agreementRef.value.agreement) {
			uni.$fui.toast('你还未阅读并同意平台使用协议~')
			return
		}
		
		const defaultParam = await formRef.value.verifyFrom()  // 验证
		const { user } = uni.$store()
			
		// 登陆
		const loginFun = codelogin.value ? symCodelogin : login  // 验证码/密码登陆
		const { accessToken } = await loginFun(defaultParam)
		user.setToken(accessToken)  // 设置登录标识
		
		// 获取用户信息
		const userinfo = await getuserInfo()
		user.setuserInfo(userinfo)  // 存储用户信息
		
		uni.navigateBack({ delta: codelogin.value ? 1 : 2 })
		uni.$fui.toast('登录成功~')
	} 
	
</script>

<style>page{background-color: #fff}</style>

<style scoped>
	/* .containerbox{height: 100vh;} */
</style>